<template>
	<view class="pl30 pr30 pt30">
		<!-- 地址盒子 -->
		<view class="flex w-max row-center h100 bg-f radius16 col-center row-between pl30 pr30" v-if="!address"  @click="gotoadd">
			<!-- <u-button type="info" size="medium">请选择地址</u-button> -->
			 <text>请选择地址</text>
			<u-icon name="arrow-right" size="26"></u-icon>
		</view>
		<view class="w-max bg-f radius16 pl30 pr30 pt30 pb30" v-else  @click="gotoadd">
			<view class="">
				<u-icon name="map" color='#F6B15D' size="30"></u-icon>
				<text class="fs24 ml20">{{address.region}}</text>
			</view>
			<view class="mt24 mb24 flex col-center row-between">
				<text class="fs26 fw-500 mr30">{{address.region}}{{address.addr}}</text>
				<u-icon name="arrow-right" size="26"></u-icon>
			</view>
			<view class="fs24">
				<text class="mr20">{{address.name}}</text>
				<text>{{address.phone}}</text>
			</view>
		</view>
		<!-- //地址盒子 -->
		
		<!-- 商品信息盒子 -->
		<view class="padding30 bg-f radius16 mt20">
			<view class="fs24 fw-500">共 <text class="color-y7">{{goods.num}}</text> 件商品</view>
			<view class="h2 mt20" style="background-color: #f5f5f5;"></view>
			<view class="mt20 flex">
				<view class="">
					<image :src="goods.img" class="radius10 w160 h160 mr20"></image>
				</view>
				<view class="flex row-column row-between flex1 u-line-1">
					<view class="fs26 fw-500 u-line-1">{{goods.name}}</view>
					<view class="fs24 flex row-between">
						<text class="fw-600">¥{{goods.price}}</text>
						<text class="color9 fw-600">x{{goods.num}}</text>
					</view>
				</view>
			</view>
		</view>
		
		<!-- 总计 -->
		<view class="flex col-bottom row-right mt20">
			<text class="color9 fs18 mr10">共{{goods.num}}件</text>
			<view class="fs18">
				<text class="mr6">小记:¥</text>
				<text class="fs32 color-y7 fw-700">{{goods.order_price}}</text>
			</view>
		</view>
		<!-- //总计 -->
		
		<!-- 支付选择 -->
		<view class="h100 bg-f radius16 flex col-center row-between pl30 pr30 mt30" @click="query.type='alipay'">
			<view class="flex col-center">
				<image src="@/static/image/home/alipay.png" class="w40 h40 mr20"></image>
				<text class="fs26 fw-500">支付宝支付</text>
			</view>
			<view class="flex col-center row-center" style="border: 2rpx dashed #C0C0C0;">
				<image src="@/static/image/home/selects.png" class="w40 h40" v-show="query.type=='alipay'"></image>
			</view>
		</view>
		<view class="h100 bg-f radius16 flex col-center row-between pl30 pr30 mt30" @click="query.type='wechat'">
			<view class="flex col-center">
				<image src="@/static/image/my/weixin.png" class="w40 h40 mr20"></image>
				<text class="fs26 fw-500">微信支付</text>
			</view>
			<view class="flex col-center row-center" style="border: 2rpx dashed #C0C0C0;">
				<image src="@/static/image/home/selects.png" class="w40 h40" v-show="query.type=='wechat'"></image>
			</view>
		</view>
		<!-- //支付选择 -->
		
		<!-- 底部按钮 -->
		<view class="fw-500 footerBtn pl30 pr30 bg-f pt20 pb70">
			<u-button type="primary" shape="circle" @click="pay">立即结算</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		onLoad(opt) {
			// opt.from==1  从订单列表过来支付
			if(opt.from==1) {
				this.goods=uni.getStorageSync('order').goods
				this.address=uni.getStorageSync('order').address
				this.order_id=uni.getStorageSync('order').id
				this.goods.order_price=uni.getStorageSync('order').total_amount
				this.total=uni.getStorageSync('order').total_amount
				this.goods.num=uni.getStorageSync('order').num
			}else {
				this.query.id=opt.id
				this.query.num=opt.num
				this.getConfirm_order()
			}
		},
		data() {
			return {
				query:{
					id:'',
					num:'',
					//	wechat：微信 alipay 支付宝
					type:'alipay'
				},
				address:{},
				goods:{},
				order_id:'',
				total:''
			};
		},
		methods:{
			getConfirm_order() {
				this.$api.confirm_order(this.query).then(res=>{
					console.log(res)
					// this.$msg(res.msg)
					this.address=res.data.address
					this.goods=res.data.goods
					this.order_id=res.data.order_id
					this.total=res.data.goods.order_price
				})
			},
			//选择地址
			gotoadd() {
				uni.$on('update',(item)=>{
					this.address=JSON.parse(item)
				})
				uni.navigateTo({
					url:'/pages/my/add_list?from=1'
				})
			},
			pay() {
				let query={
					order_id:this.order_id,
					total_amount:this.total,
					address_id:this.address.id,
					type:this.query.type
				}
				this.$api.pay(query).then(res=>{
					console.log(res)
					let payType=''
					this.query.type=='alipay' ? payType='alipay' : payType='wxpay'
					let that = this
					if(payType=='wxpay') {
						res.data.payParams= JSON.parse(res.data.payParams)
						uni.requestPayment({
						    "provider": "wxpay", 
						    "orderInfo":res.data.payParams,
						    success(res) {
								console.log(res)
								that.$msg('支付成功')
								setTimeout(()=>{
									that.$jump('/pages/my/my_order?id=0')
								},500)
							},
						    fail(e) {}
						})
					}else {
						this.$tool.pay(res.data.payParams,payType).then(res2=>{
						})
					}
				})	
			}
		}
	}
</script>

<style lang="scss">

</style>
